<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>文章详情</title>
	<link rel="stylesheet" type="text/css" href="../../build/css/base.css"/>
	<link rel="stylesheet" type="text/css" href="../../build/css/main.css">
	<link rel="stylesheet" type="text/css" href="../../build/css/find.css">
	<script type="text/javascript" src="../../build/js/jquery.min.js"></script>
	<script src="../../build/public/vue.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../build/js/template.js"></script>
	<script type="text/javascript" src="../../build/public/base.js"></script>
	<script type="text/javascript" src="../../build/public/vue-resource.js"></script>
	<script type="text/javascript" src="../../build/js/config.js"></script>
	<script type="text/javascript" src="../../build/js/common.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
</head>
<body style="background:#fff;">
	<div id="container" class="detail" style="padding-bottom: 50px;">
		<div class="banner" style="overflow:hidden;height:auto;max-height:200px;width:100%;position:relative;">
			<img v-bind:src="Detail.pictureUrl2" style="width:100%;height:auto;display:block;" />
			<!--<div class="opacity"></div>-->
			<!--<p class="title">{{Detail.title}}</p>		-->
			<p class="title" style="height:100%;line-height: 100%;"><span style="position:absolute;top:50%;left:2.5%;margin-top:-9px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-align:center;display:block;width:95%;">{{Detail.title}}</span></p>
		</div>
			
		<div class="content">
			<p class="title">{{Detail.title}}</p>
			<div class="describe">
				<span class="date">{{Detail.time | formatTime('')}}</span>&nbsp;&nbsp;&nbsp;&nbsp;
				<span class="form">来自:{{Detail.author}}</span>
			</div>
			<div class="text"v-html="Detail.content">
				
			</div>
			<div class="qrcode">
				<p>长按二维码识别关注<span style="color: red;">资招公众号</span></p>
				<img src="../../build/images/code.jpg"/ width="50%">
			</div>
		</div>
		<div class="statistics" style="border-top:1px solid #efefef;">
			<p class="praise">
				<span class="iconfont" v-if="!isPraise" @click="praise">&#xe64e;</span>
				<span class="iconfont" v-if="isPraise" @click="praise">&#xe652;</span>
				<span style="margin-left: 10px;color: #333333;">点赞：{{Detail.praisedCount | statistics}}</span>
			</p>
			<p class="share" @click="share"><span class="iconfont">&#xe64f;</span><span style="color: #333333;">转发：{{Detail.sharedCount | statistics}}</span></p>
		</div>
		<div class="share-jump-wrap">
			<div class="iconfont-wrap">
				<span class="iconfont">&#xe65b;</span>
			</div>
			<div class="iconfont-text">
				<span>发送给微信好友</span>
				<span>请从这里下手</span>
			</div>
		</div>
		<div class="share-jump-bg" @click="cancelShere"></div>
	</div>
	<script type="text/javascript">
		var vm = new Vue({
			el:"#container",
			data:{
				idStr:'',
				Detail:'',
				isPraise:false  //是否点赞
			},
			mounted:function(){
				this.$nextTick(function(){
					//分享
					post('/weiXinOAuth/advisor/no-login/auth-share',{authUrl:window.location.href},function(res){
						if(res.code=="OK"){
							vm.timestamp=res.data.timestamp;
							vm.nonceStr=res.data.nonceStr;
							vm.signature=res.data.signature;
							wx.config({
							  debug: false,
							  appId: 'wxfc53d38dc557de17',
							  timestamp: vm.timestamp,
							  nonceStr: vm.nonceStr,
							  signature: vm.signature,
							  jsApiList: [
							    'checkJsApi',
							    'onMenuShareTimeline',
							    'onMenuShareAppMessage',
							    'openLocation',
							    'getLocation',
							  ]
							});
							wx.ready(function () {
								wx.onMenuShareAppMessage({
								    title: vm.Detail.title, // 分享标题
								    desc: '资招 | 简单投资', // 分享描述
								    link: window.location.href, // 分享链接
								    imgUrl: 'http://zz.zdcf.cn/build/images/logo.png', // 分享图标
								    type: '', // 分享类型,music、video或link，不填默认为link
								    dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
								    success: function () { 
								    	get('/discovery/opinion/share',{opinionIdStr:vm.idStr},function(res){
								    		vm.Detail.sharedCount=res.data.sharedCount;
								    	});
								    },
								    cancel: function () { 
								       
								    }
								}); 
								// 分享到朋友圈
								wx.onMenuShareTimeline({
									title: vm.Detail.title,
									link: window.location.href, // 分享链接
									imgUrl: 'http://zz.zdcf.cn/build/images/logo.png', // 分享图标
									success: function () { 
								    	get('/discovery/opinion/share',{opinionIdStr:vm.idStr},function(res){
								    		vm.Detail.sharedCount=res.data.sharedCount;
								    	});

									},
								});
							});	
						}
					});
				})
			},
			methods:{
				getId:function(){
					this.idStr = getParameter('idStr')
					console.log(this.idStr)
				},
				getDetail:function(){
					get('/discovery/opinion/info',{opinionIdStr:this.idStr},function(res){
						vm.Detail = res.data
						vm.isPraise = res.data.isPraised
						vm.Detail.pictureUrl2 = domain+res.data.pictureUrl
						console.log(vm.Detail.isPraised)
					},function(res){
						toast(res.error)
					})
				},
				praise:function(){
					if(window.localStorage.getItem('X-Auth-Token')){
						//点赞
						post('/discovery/opinion/praise',{opinionIdStr:this.idStr,praise:!this.isPraise},function(res){
							if(res.data.isPraised == true){
								toast('点赞成功')
								vm.isPraise = true
							}else{
								toast('取消成功')
								vm.isPraise = false
							}
							vm.getDetail()
						},function(res){
							toast(res.error)
						})
					}else{
						window.location.href="../../pages/login/login.html";
					}
				},
				share:function(){
					//分享
					post('/weiXinOAuth/advisor/no-login/auth-share',{authUrl:window.location.href},function(res){
						if(res.code=="OK"){
							vm.timestamp=res.data.timestamp;
							vm.nonceStr=res.data.nonceStr;
							vm.signature=res.data.signature;
							wx.config({
							  debug: false,
							  appId: 'wxfc53d38dc557de17',
							  timestamp: vm.timestamp,
							  nonceStr: vm.nonceStr,
							  signature: vm.signature,
							  jsApiList: [
							    'checkJsApi',
							    'onMenuShareTimeline',
							    'onMenuShareAppMessage',
							    'openLocation',
							    'getLocation',
							  ]
							});
							wx.ready(function () {
								wx.onMenuShareAppMessage({
								    title: vm.Detail.title, // 分享标题
								    desc: '资招 | 简单投资', // 分享描述
								    link: window.location.href, // 分享链接
								    imgUrl: 'http://zz.zdcf.cn/build/images/logo.png', // 分享图标
								    type: '', // 分享类型,music、video或link，不填默认为link
								    dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
								    success: function () { 
								    	get('/discovery/opinion/share',{opinionIdStr:vm.idStr},function(res){
								    		vm.Detail.sharedCount=res.data.sharedCount;
								    	});
								    },
								    cancel: function () { 
								       
								    }
								}); 
								// 分享到朋友圈
								wx.onMenuShareTimeline({
									title: vm.Detail.title,
									link: window.location.href, // 分享链接
									imgUrl: 'http://zz.zdcf.cn/build/images/logo.png', // 分享图标
									success: function () { 
								    	get('/discovery/opinion/share',{opinionIdStr:vm.idStr},function(res){
								    		vm.Detail.sharedCount=res.data.sharedCount;
								    	});

									},
								});
							});	
						}
					});
					$(".share-jump-wrap").show();
					$(".share-jump-bg").show();
					$('.mine-not-login').hide();
				},
				cancelShere:function(){
					//取消分享
					$(".share-jump-wrap").hide()
					$(".share-jump-bg").hide()
				}
			},
			filters:{
				statistics:function(number){
					if(number>1000){
						return '999+'
					}else{
						return number
					}
				}
			},
			created:function(){
				this.getId()
				this.getDetail()
			}
		})
		
		
	</script>
</body>
</html>